<template>
    <!-- marketing/pages/group/more/index.wxml -->
    <view>
        <group-header></group-header>
        <!-- <nav txtColor="#18181A" image="http://oos-cn.ctyunapi.cn/front-end/static/marketingImg/static/back.png" title="拼团活动" :show_bol="false"></nav> -->

        <view class="container">
            <text class="text">拼团活动</text>
            <view v-if="allList.length < 1">
                <Upgrading text="暂无拼团活动"></Upgrading>
            </view>
            <group-card :info="item" @invite="onShowShare" v-for="(item, index) in allList" :key="index" @show="show"></group-card>
        </view>

        <!-- 悬浮icon -->
        <view class="icon-box" @tap="goGroup">
            <image class="img" src="http://oos-cn.ctyunapi.cn/front-end/static/marketingImg/marketing/images/suspension-icon.png"></image>
        </view>

        <!-- 分享弹窗 -->
        <!-- <group-share-pop class="group-share-pop" :group-id="groupId" :activity-id="activityId"></group-share-pop> -->
		<shareTabs ref='shareTabs' :tabs='tabs' :tabsShow='tabsShow' :shareConfig='shareConfig' @tabsClose='tabsClose'></shareTabs>
    </view>
</template>

<script>
// import zpMixins from '@/uni_modules/zp-mixins/index';
import groupHeader from '../../../components/group-header/index';
import groupCard from '../../../components/group-card/index';
import groupSharePop from '../../../components/group-share-pop/index';
import nav from '../../../../components/nav/nav';
import Upgrading from '@/components/upgrading/upgrading';

// marketing/pages/group/more/index.ts
const app = getApp();
import { getGroupList } from '../../../../api/marketing/group';
import shareTypes from '../../../../utils/shareTypes';
const dayjs = require('./../../../../utils/dayjs.min.js');
import shareTabs from 'marketing_page/components/share-tabs/share-tabs';
export default {
    components: {
        groupHeader,
        groupCard,
        // groupSharePop,
        nav,
        Upgrading,
		shareTabs
    },
    data() {
        return {
			sharePath:'',
			tabsShow:false,
			shareConfig:{},
			tabs: ['share'],
            allList: [],
            queryParam: {
                current: 1,
                size: 10,
                groupStatus: undefined,
                sellerId: app.globalData.sellerId,
                userId: uni.getStorageSync('memberId')
            },
            totalPage: 0,
            activityId: 0,
            groupId: 0
        };
    },
    /**
     * 生命周期函数--监听页面加载
     */
    onLoad() {
        this.queryParam.userId = uni.getStorageSync('memberId');
    },
    onShow() {
		this.show()
        
    },
    onReachBottom() {
        if (this.queryParam.current < this.totalPage) {
            this.setData({
                queryParam: {
                    ...this.queryParam,
                    current: this.queryParam.current + 1
                }
            });
            this.getAllList();
        }
    },
    onShareAppMessage() {
        return {
            title: '参团邀请',
            imageUrl: 'http://oos-cn.ctyunapi.cn/front-end/static/marketingImg/marketing/images/invitation/activity.png',
            path: this.sharePath
        };
    },
    methods: {
		setSharePath() {
			const { activityId, groupId } = this;
			let uid = uni.getStorageSync('memberId');
			let userInfo = uni.getStorageSync('userInfo') || {};
			this.setData({
				sharePath: `/pages/sharePage/sharePage?groupId=${groupId}&activityId=${activityId}&ST=${shareTypes.PINGTUAN}`,
				shareConfig: {
					path: '/pages/sharePage/sharePage',
					scene: `groupId=${groupId}&activityId=${activityId}&ST=${shareTypes.PINGTUAN}`,
					wxPath: `pages/sharePage/sharePage?groupId=${groupId}&activityId=${activityId}&ST=${shareTypes.PINGTUAN}`,
					wxTitle:`参团邀请`,
					wxImage:'http://oos-cn.ctyunapi.cn/front-end/static/marketingImg/marketing/images/invitation/activity.png'
				}
			});
		},
		tabsClose() {
			this.setData({
				tabsShow: false
			});
		},
		show(){
			this.resetComfig();
			this.getAllList();
		},
        resetComfig() {
            this.queryParam.current = 1;
            this.totalPage = 0;
        },

        // 跳转拼团
        goGroup() {
            uni.navigateTo({
                url: '/marketing_page/pages/group/list/index'
            });
        },

        onShowShare(data) {
            const { activityId, groupId } = data.detail;
            this.setData({
                activityId,
                groupId
            });
			this.setSharePath()
            this.tabsShow = true
        },

        async getAllList() {
            const { code, data } = await getGroupList({
                ...this.queryParam
            });
            if (code === 200) {
                const allList = data.records.map((item) => {
                    item.countDown = dayjs(item.endGroupTime).valueOf() - dayjs().valueOf();
                    console.log(item.countDown)
                    return item;
                });
                this.setData({
                    allList: allList,
                    totalPage: data.totalPage
                });
            }
        }
    }
};
</script>
<style lang="less" scoped>
/* marketing/pages/group/more/index.wxss */

.container {
    margin: 20rpx 0;

    .text {
        width: 100%;
        font-size: 32rpx;
        font-family: PingFang SC;
        font-weight: bold;
        color: #303133;
        margin-left: 24rpx;
    }
}

.icon-box {
    position: fixed;
    right: 24rpx;
    bottom: 200rpx;
	z-index: 999;

    .img {
        width: 142rpx;
        height: 142rpx;
    }
}

/deep/.u-count-down__text{
    font-weight: bold;
    color: #ffffff;
}
</style>
